
<template>
  <el-container class="bg_img1">
    <el-main class="bg_size1">
      <h1 class="ZC">登录用户信息</h1>
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        class="demo-ruleForm"
        label-position="left"
        label-width="120px"
      >
      <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="用户id" prop="id" class="item">
              <el-input
                v-model="ruleForm.id"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="用户名" prop="accountname" class="item">
              <el-input
                v-model="ruleForm.accountname"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="真实姓名" prop="name" class="item">
              <el-input
                v-model="ruleForm.name"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item
              label="性别"
              prop="sex"
              :formatter="formatterGender"
              class="item"             
            >
              <el-radio-group v-model="ruleForm.sex" disabled>
                <el-radio label="男" :formatter="formatterGender"></el-radio>
                <el-radio label="女" :formatter="formatterGender"></el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8" :offset="8">
            <el-form-item label="电话号码" prop="phone" class="item">
              <el-input
                v-model="ruleForm.phone"
                disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
    </el-main>
  </el-container>
</template>
<script>
import axios from "axios";
import qs from "querystring";
import store from "../store";

export default {
  name: "ShowMessageVue",
  data() {
    return {
      ruleForm: {
        id: this.$store.state.accountInfo.id,
        accountname: this.$store.state.accountInfo.accountname,
        name: this.$store.state.accountInfo.name,
        sex: this.$store.state.accountInfo.sex,
        phone: this.$store.state.accountInfo.phone,
      },
    }
  },

  methods: {
    
  }
}
</script>

<style scoped>
.ZC {
  font-size: 30px;
  margin-left: 40%;
  color: rgb(150, 172, 192);
}
.msg {
  color: red;
  margin-bottom: 15px;
}
</style>
